<template>
  <div id="app" class="container">
      <router-view :msg="a" @aa="aa" ref="as"></router-view>
  </div>
</template>
<script>
export default {
  name: "App",
  data() {
    return {
      open: false,
      a: "123",
    };
  },
  methods: {
    show: function () {
      this.open = this.open == false ? true : false;
    },
    aa: function (val) {
      console.log(val);
    },
  },
  mounted() {
    console.log(this.$refs);
    window.onload = function () {
      const width = document.body.clientWidth;
      const view = document.getElementById("view");
      const open = document.getElementById("open");
      console.log(width);
      if (width <= 375) {
        view.style.display = "none";
        open.style.display = "block";
        open.className = "el-icon-menu";
        open.style.background = "skyblue";
      } else {
        view.style.display = "block";
        open.style.display = "none";
      }
    };
  },
};
</script>
